
.topicConter12{
    margin-top:10px;
    margin-left:12%;
     width:640px;
     height:auto;
     float: left;
     .topicCentent{
         width:640px;
         height:auto;
         border-radius: 2px;
         background: #fff;
         margin-bottom:10px;
         // background:#f00;
         .header{
             width:640px;
             height:64px;
             display: flex;
             align-items: center;
             justify-content: space-between;
             padding: 16px 20px 0 20px;
            
             .left{
                 position: relative;
                 width:435px;
                 height:48px;
                 .left-Img{
                     width:45px;
                     height:45px;
                     background: #000;
                     border-radius: 50%;
                     float: left;
                     img{
                         width:45px;
                         height:45px;
                         border-radius: 50%;
                     }
                 }
                 
                 .left-Title{
                     width: 320px;
                     height:20px;
                     line-height: 24px;
                     font-weight: 600;
                     margin-left:12px;
                     float: left;
                     color:rgb(26, 26, 26);
                     font-size:18px;
                 }
                 .left-xinxi{
                     margin-left:12px;
                     float: left;
                     line-height: 29px;
                     height:20px;
                     color: #8a9aa9;
                 }
                 .topicInfo{
                     width:267px;
                     height:158px;
                     background: #fff;
                     border:1px solid #ccc;
                     position: absolute;
                     top :55px;
                     left:-120px;
                     z-index: 1;
                     display: none;
                     .Info-header{
                         width:265px;
                         height:70px;
                         margin-top:12px;
                         .Info-left{
                             width:63px;
                             height:63px;
                             border-radius: 50%;
                             float: left;
                             background: #000;
                             margin: 3px 0 0 20px;
                             img{
                                 width:63px;
                                 height:63px;
                                 border-radius: 50%;
                             }
                         }
                         .Info-right{
                             width:170px;
                             height:70px;
                             float: right;
                             span{
                                 width:150px;
                                 height:25px;
                                 display: block;
                                 font-size:13px;
                                 line-height:25px;
                                 // text-align: center;
                                 margin:6px 0;
                                 color:#0e0e0e;
                             }
                             em{
                                 width:150px;
                                 height:25px;
                                 display: block;
                                 overflow: hidden;
                                 text-overflow:ellipsis;
                                 white-space:nowrap;
                                 margin-top:8px;
                             }
                         }
                     }
                     .Info-footer{
                         width:266px;
                         height:74px;
                         .Info-one{
                             width:50px;
                             height:45px;
                             float: left;
                             margin:15px 25px 0 5px;
                             text-align: center;
                             b{
                                 width:50px;
                                 font-size: 16px;
                                 display: inline-block;
                             }
                             i{
                                 height:22px;
                                 font-size: 12px;
                                 line-height: 20px;
                                 color:#8a9aa9;
                             }
                         }
                         .Info-two{
                             width:50px;
                             height:45px;
                             float: left;
                             margin:15px 45px 0 0;
                             text-align: center;
                             b{
                                 width:50px;
                                 font-size: 16px;
                                 display: inline-block;
                             }
                             i{
                                 height:22px;
                                 font-size: 12px;
                                 line-height: 20px;
                                 color:#8a9aa9;
                             }
                         }
                         .Info-there{
                             width:55px;
                             height:26px;
                             text-align: center;
                             line-height: 26px;
                             border-radius: 2px;
                             display:block;
                             border:1px solid #37c701;
                             margin:30px 0 0 10px;
                             float: left;
                             a{
                                 color:#37c701;
                                 font-size:12px;
                             }
                         
                         }
                     }
                 }
                 &:hover{
                 .topicInfo{
                     display: block;
                 }
             }
             }
             
             .right{
                 width:55px;
                 height:26px;
                 text-align: center;
                 line-height: 26px;
                 border-radius: 2px;
                 display:block;
                 border:1px solid #37c701;
                 a{
                     color:#37c701;
                     font-size:12px;
                 }
             }
         }
         .content{
             width:507px;
             height:auto;
             font-size: 15px;
             line-height: 24px;
             position: relative;
             margin: 7px 20px 7px 77px;
             white-space: pre-wrap;
             color: #17181a;
         
         }
         .images{
             width:514px;
             height:114px;
             position: relative;
             margin: 4px 20px 0 77px;
             img{
                 width:110px;
                 height:110px;
                 margin:4px 4px 0 0;
             }
         }
         p{
             height:24px;
             position: relative;
             margin: 10px 20px 0 77px;
             a{
                 font-size: 13px;
                 display: inline-block;
                 line-height: 22px;
                 padding: 0 12px;
                 border: 1px solid #007fff;
                 border-radius: 14px;
                 color: #007fff;
                 user-select: none;
             }
         }
         .footer{
             width:640px;
             height:28px;
             display: flex;
             position: relative;
             margin-top:12px;
             border-top: 1px solid #ebebeb;
             span{
                 display: block;
                 width:215px;
                 height:auto;
                 margin:5px 0;
                 border-right:1px solid #ebebeb;
                 display: flex;
                 align-items: center;
                 justify-content: center;
                 position: relative;
                 b{
                     display: block;
                     width:18px;
                     height:18px;
                     img{
                         width:16px;
                         height:16px;
                     }
                 }
                 em{
                     display: block;
                     margin:3px 0 0 3px;
                     font-size: 13px;
                     font-weight: 500;
                     color: #8a93a0;
                 }
             }
         }
         
     }
 }